import 'package:flutter/material.dart';
import 'package:flutter_custom_view/flutter_custom_view.dart';

enum SwearType {
  block,
  tailing,
  gradient,
  rubber,
}

class CheckSmearWidget extends StatefulWidget {
  final SwearType type;
  final Color startColor;
  final Color bgColor;
  final int number;
  final int milliseconds;
  final int modeValue;
  final List<Color> colorList;
  final ValueChanged<List<Color>> onClickColorList;
  final ValueChanged<List<Color>> onClickColorListEnd;
  const CheckSmearWidget({Key? key,
    this.type = SwearType.rubber,
    this.startColor = Colors.white,
    this.bgColor = Colors.black,
    this.number = 400,
    this.milliseconds = 1000,
    this.modeValue = 0x01,
    required this.colorList,
    required this.onClickColorList,
    required this.onClickColorListEnd,
  }) : super(key: key);

  @override
  State<CheckSmearWidget> createState() => _CheckSmearWidgetState();
}

class _CheckSmearWidgetState extends State<CheckSmearWidget> {
  late List<Color> colorList;
  late Color startColor;
  late double width;
  late double height;

  @override
  void initState() {
    // TODO: implement initState
    getDate();
    super.initState();
  }

  getDate(){
      if(widget.colorList!=null){
        colorList=widget.colorList;
      }else{
        colorList=List.generate(widget.number, (index) => Colors.black);
      }
      startColor = widget.startColor;
  }

  @override
  void didUpdateWidget(covariant CheckSmearWidget oldWidget) {
    // TODO: implement didUpdateWidget
    if(widget.startColor != oldWidget.startColor||widget.colorList != oldWidget.colorList){
      setState((){
        getDate();
      });
    }
    super.didUpdateWidget(oldWidget);
  }

  @override
  Widget build(BuildContext context) {
    return LayoutBuilder(builder: (context, cons) {
      if (cons.maxWidth * 1 / 1 < cons.maxHeight) {
        width = cons.maxWidth;
        height = cons.maxWidth * 1 / 1;
      } else {
        width = cons.maxHeight * 1 / 1;
        height = cons.maxHeight;
      }
      return Container(
        width: width,
        height: height,
        color: widget.bgColor,
        child: Stack(
          alignment: Alignment.center,
          children: [
            SizedBox(
              width: width,
              height: height,
              child: GridView.builder(
                  itemCount: colorList.length,
                  physics: const NeverScrollableScrollPhysics(),
                  gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: 20,
                      childAspectRatio:1,
                      mainAxisSpacing: 2,
                      crossAxisSpacing: 2,
                  ),
                  itemBuilder: (BuildContext context,int index){
                    return Container(
                      decoration: BoxDecoration(
                        color: colorList[index],
                        borderRadius: BorderRadius.circular(2),
                        border: Border.all(
                          width: 2,
                          color: Colors.transparent,
                        ),
                      ),
                    );
                  }),
            ),
            GestureDetector(
              onPanDown: _onPanDown,
              onPanUpdate: _onPanUpdate,
              onPanEnd: _onPanEnd,
              child: Container(
                width: width,
                height: height,
                color: Colors.transparent,
              ),
            ),
          ],
        ),
      );
    });
  }
  ///按下，获取初始位置
  void _onPanDown(DragDownDetails update) {
    int number = getPosition(update.localPosition);
    setState((){colorList[number] = startColor;});
  }

  void _onPanUpdate(DragUpdateDetails update) {
    int number = getPosition(update.localPosition);
    setState((){colorList[number] = startColor;});
    widget.onClickColorList(colorList);
  }

  void _onPanEnd(DragEndDetails update) {
    widget.onClickColorListEnd(colorList);
  }

  int getPosition(Offset localPosition){
     width;height;
      double oneH = width/20;
      double oneV = height/20;
      int x = localPosition.dx~/oneH;
      int y = localPosition.dy~/oneV;
      int num = y*20+x;
    return num;
  }
  
}

class CheckSmearModel{
  late Offset position;
  late Color color;
  late int index;
  CheckSmearModel({required this.position,required this.color,required this.index});
}
